<template>
<div class="app">
  <h2>当前计数:{{ counter }}</h2>
<add-counter @add="increment"></add-counter>
<sub-counter @sub="decrement"></sub-counter>
</div>
   
</template>

<script>
import AddCounter from './AddCounter.vue'
import SubCounter from './SubCounter.vue'
export default {
  components: {
     AddCounter,
    SubCounter
    
  },
  inheritAttrs:false,
  data() {
    return {
      title: '我还是标题',
      counter: 0,
    }
  },
  methods: {
    increment(count) {
     this.counter+=count
    },
    decrement(count) {
      this.counter-=count
    },
  },
}
</script>

<style scoped>
h2 {
  color: red;
}
.active{
  color: red;
}
</style>
